﻿
$(function() {
    /**
     * 消耗电镀
     * */
    var electricitybar = echarts.init(document.getElementById('electricityOpt'));
    optionBar1 = {
    		tooltip : {
    	        trigger: 'axis',
    	        axisPointer : {            
    	            type : 'shadow'        
    	        },
    	        position: function (point, params, dom) {
    	            // 固定在顶部
    	            return [point[0], '10%'];
    	        }
    	    },
    	    grid: {
	            top: '25%',
	            left: '2%',
	            right: '8%',
	            bottom:'4%',
	            containLabel: true
	        },
    	    legend: {
    	    	top: '5',
    	    	right:'20',
    	        data:['电度']
    	    },
//    	    dataZoom:{
//    	    	type:'slider',
//    	    	start:0,
//    	    	end:100,
//    	    	labelFormatter: function (value) {
//    	    	    return value; // 返回最终的label内容。
//    	    	},
//    	    	bottom:1
//    	    },
    	    backgroundColor:'#e0e0e0',
    	    color:['#8dc63f'],
    	    xAxis:  {
            	type: 'category',
    	        data: [],//['OP100','OP200','OP300','OP400','OP500'],
    	        splitLine:{
	            	show:false
	            },
	            axisLabel :{  
				    interval:0
				   // rotate:40 
				}
    	    },
    	    yAxis: {
    	    	 min:0,
    	    	 type: 'value',
    	    	 name:'电度(度)',
    	    	 axisLabel:{
    	    		 formatter: '{value}'
    	    	 },
    	    	 splitLine:{
 	            	show:false
 	            }
    	    },
    	    series: [{
    	    	name: '电度',
	            stack: '总量',
	            type: 'bar',
	            barMaxWidth:40,
	            data:[]// [10,20,30,40,50]
    	    }]
	};
    electricitybar.setOption(optionBar1);
   
    
    /**
     * 电费
     * */
    var chartbar = echarts.init(document.getElementById('chartOpt'));
    optionBar2 = {
    		tooltip : {
    	        trigger: 'axis',
    	        axisPointer : {            
    	            type : 'shadow'        
    	        },
    	        position: function (point, params, dom) {
    	            // 固定在顶部
    	            return [point[0], '10%'];
    	        }
    	    },
    	    grid: {
	            top: '25%',
	            left: '2%',
	            right: '9%',
	            bottom:'4%',
	            containLabel: true
	        },
    	    legend: {
    	    	 top: '0',
    	    	right:'20',
    	        data:[]//['电费'],
    	    },
//    	    dataZoom:{
//    	    	type:'slider',
//    	    	start:0,
//    	    	end:100,
//    	    	labelFormatter: function (value) {
//    	    	    return value; // 返回最终的label内容。
//    	    	},
//    	    	bottom:1
//    	    },
    	    backgroundColor:'#e0e0e0',
    	    color:['#00b19d','#ff6264','#f7aa47'],
    	    xAxis:  {
            	type: 'category',
    	        data: [],//['OP100','OP200','OP300','OP400','OP500'],
    	        splitLine:{
	            	show:false
	            },
	            axisLabel :{  
				    interval:0
				   // rotate:40 
				}
    	    },
    	    yAxis: {
    	    	 min:0,
    	    	 type: 'value',
    	    	 name:'电费(元)',
    	    	 axisLabel:{
    	    		 formatter: '{value}'
    	    	 },
    	    	 splitLine:{
 	            	show:false
 	            }
    	    },
    	    series: [
//    	             {
//    	    	name: '电费',
//	            stack: '总量',
//	            type: 'bar',
//	            barMaxWidth:40,
//	            data: [10,20,30,40,50]
//    	    }
    	             ]
	};
    chartbar.setOption(optionBar2);
    
    /**
     * 满载率
     * */
    var ratebar = echarts.init(document.getElementById('rateOpt'));
    optionBar3 = {
    		tooltip : {
    	        trigger: 'axis',
    	        axisPointer : {            
    	            type : 'shadow'        
    	        },
    	        position: function (point, params, dom) {
    	            // 固定在顶部
    	            return [point[0], '10%'];
    	        }
    	    },
    	    grid: {
	            top: '25%',
	            left: '2%',
	            right: '8%',
	            bottom:'4%',
	            containLabel: true
	        },
    	    legend: {
    	    	top: '5',
    	    	right:'20',
    	        data:[]//['满载','空载'],
    	    },
//    	    dataZoom:{
//    	    	type:'slider',
//    	    	start:0,
//    	    	end:100,
//    	    	labelFormatter: function (value) {
//    	    	    return value; // 返回最终的label内容。
//    	    	},
//    	    	bottom:1
//    	    },
    	    backgroundColor:'#e0e0e0',
    	    color:['#f7aa47','#999933'],
    	    xAxis:  {
            	type: 'category',
    	        data: [],//['OP100','OP200','OP300','OP400','OP500'],
    	        splitLine:{
	            	show:false
	            },
	            axisLabel :{  
				    interval:0
				   // rotate:40 
				}
    	    },
    	    yAxis: {
    	    	 min:0,
    	    	 max:100,
    	    	 type: 'value',
    	    	 name:'满载率(%)',
    	    	 axisLabel:{
    	    		 formatter: '{value}'
    	    	 },
    	    	 splitLine:{
 	            	show:false
 	            }
    	    },
    	    series: [
//    	             {
//    	    	name: '满载',
//	            stack: '总量',
//	            type: 'bar',
//	            barMaxWidth:40,
//	            data: [10,20,30,40,50]
//    	    },{
//    	    	name: '空载',
//	            stack: '总量',
//	            type: 'bar',
//	            barMaxWidth:40,
//	            data: [10,20,30,40,50]
//    	    }
    	    ]
	};
    ratebar.setOption(optionBar3);
    
    
    var lineId=0;
    var	startWeek="";
    var	endWeek="";
    var year=moment().year();
    
    /**
     * slider滑动事件
     * */
    $('#ss').slider({
    	range: true,
        onComplete:function(value){//滑块值改变时触发
	       	startWeek=value[0];
	       	endWeek=value[1];
	       	getData();
       }
    });
    /**
     * 初始化
     * */
    var vm = new Vue({
	    el: '#itemData',
	    data:{item:[]}
	}); 
    var currentWeek=moment().week();
    var weeks="";
    if(currentWeek<8){
    	weeks=[1,currentWeek];
    }else{
    	weeks=[moment().subtract(7, 'w').week(),currentWeek];
    }
    $('#ss').slider('setValues',weeks);
    var arr=$('#ss').slider('getValues');
    startWeek=arr[0];
    endWeek=arr[1];
    getData();
    
    function getData(){
    	$.post(basePath+"/compare/electricitycompare/week.json",{"lineId":lineId,belongYear:year,start:startWeek,end:endWeek},function(res){
    		vm.$set('item',res);
//    		if(res.success){
			
			electricitybar.setOption({
		        xAxis: {
		            data: res.equNames
		        },
		        series: [{
		            data: res.electricityBar
		        }]
			});
			var seriesCharge=[];
		    for(var i = 0;i<res.chargeBar.length;i++){
		    	seriesCharge.push({
		            name: res.chargeBar[i].name,
		            stack: '总量',
		            type: 'bar',
		            barMaxWidth:40,
		            data: res.chargeBar[i].value
		        });
		    }
			chartbar.setOption({
		        xAxis: {
		            data: res.equNames
		        },
		        legend: {
	    	        data:res.chargeLeg
	    	    },
		        series: seriesCharge
			});
			var series=[];
		    for(var i = 0;i<res.fullRateBar.length;i++){
		        series.push({
		            name: res.fullRateBar[i].name,
		            stack: '总量',
		            type: 'bar',
		            barMaxWidth:40,
		            data: res.fullRateBar[i].value
		        });
		    }
		    ratebar.setOption({
				legend: {
		            data: res.stateLeg
		        },
				xAxis: {
		            data: res.equNames
		        },
		        series:series
			});
//    		}	
    	});
    }


  //点击事件
	 $("#defineTime").click(function (){
		 var mePanel = $('#defineTimeWin');
	   	 mePanel.dialog('open');
	 });
	//定义时间的表单
	$('#defineTimeWin').dialog({
		title:'自定义时间',
		width:400,
		height:150,
		iconCls:'icon-add',
		closed: true,
		modal: true,
		inline:true,
		buttons:[{
			text:'确定',
			iconCls:'icon-add-new',
			handler:function(){
					var st=$("input[name='startTime']").val();
					var cmax=moment(st, "YYYY").weeksInYear();
					year=st;
					$('#ss').slider({
						max:cmax
					});
					getData();
					$('#defineTimeWin').dialog('close');

			}
		},{
			text:'取消',
			iconCls:'icon-redo',
			handler:function(){
				$('#defineTimeWin').dialog('close');
			}
		}],
		onClose: function() {
			$('#defineTimeform').form('reset');
		}
	});
	 /**
	  * 切换设备的点击事件
	  * */
	var mePanel = $('#switchEquip');
	$("#linetree").tree({
		onDblClick: function(node) {
			if (node.url) {
				if(node.shifts){
					lineId=node.id;
		 			mePanel.dialog('close');
				}else{
					$.messager.alert({showSpeed:100,title:'消息提示',msg:'该生产线无班次，请重新选择',timeout:3000});
				}
			}else{
				$.messager.alert({showSpeed:100,title:'消息提示',msg:'请选择生产线！',timeout:3000});
			}
		}
	});
$("#switchEquipOK").click(function(){
	var row = $("#linetree").tree('getSelected');
	if(row.url){
		lineId=row.id;
		mePanel.dialog('close');
	}else{
		$.messager.alert({showSpeed:100,title:'消息提示',msg:'请选择生产线！',timeout:3000});
	}
});
});